<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>

  <body>
    <button class="btn1">删除cookie</button>
    <button class="btn2">设置cookie</button>
    <button class="btn3">获取cookie</button>
    <script>
      // 一、删除cookie
      // 让cookie 立刻过期 ；
      document.querySelector(".btn1").onclick = function () {
        document.cookie = "myname='';Max-Age=-1";
      };

      document.querySelector(".btn2").onclick = function () {
        document.cookie = "myname=hello;Max-Age=3600;path=/admin";
      };

      document.querySelector(".btn3").onclick = function () {
        console.log(document.cookie);
      };

      // 二、cookie的路径 ；
      // 只能在 同级 或者比当前路径小的路径获取 ；
      // admin 底下获取 或同级 获取 cookie ，不能 在路径之上获取；
      /* 
        使用  ： 记录登录态 
            标记网络状态 ，随着http一起发送给后端 ；
            一般一个域名 允许 50个 cookie  大小 大概 4k；
        
        
        */
    </script>
  </body>
</html>
